import 'package:flutter/material.dart';


class WorkbenchPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          SizedBox(height: 40), // 用于模拟状态栏的高度
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 15.0),
            child: Row(
              children: [
                Expanded(
                  child: Container(
                    height: 36,
                    decoration: BoxDecoration(
                      color: Color(0xFF767680).withAlpha(50),
                      borderRadius: BorderRadius.circular(18),
                    ),
                    child: TextField(
                      decoration: InputDecoration(
                        prefixIcon: Icon(Icons.search, color: Color(0xFF7838387)),
                        hintText: '搜索',
                        hintStyle: TextStyle(color: Color(0xFF7838387)),
                        border: InputBorder.none,
                        contentPadding: EdgeInsets.only(top: 2), // 调整文本垂直居中
                      ),
                      style: TextStyle(color: Color(0xFF7838387)),
                    ),
                  ),
                ),
                SizedBox(width: 10),
                Text(
                  '管理',
                  style: TextStyle(color: Colors.black, fontSize: 16),
                ),
              ],
            ),
          ),
          Container(
            margin: EdgeInsets.all(8.0),
            width: double.infinity,
            height: 150,
            decoration: BoxDecoration(
              color: Colors.blueAccent,
              borderRadius: BorderRadius.circular(10),
            ),
            child: Center(
              child: Text(
                '新万户 兴互联\n破局 行动 赢未来',
                textAlign: TextAlign.center,
                style: TextStyle(
                  color: Colors.white,
                  fontSize: 20,
                ),
              ),
            ),
          ),
          Expanded(
            child: ListView(
              padding: EdgeInsets.zero, // 去掉 ListView 的内边距
              children: [
                Section(
                  title: '常用应用',
                  items: List.generate(8, (index) {
                    return GridItem(index: index);
                  }),
                ),
                Section(
                  title: '常用应用',
                  items: List.generate(8, (index) {
                    return GridItem(index: index + 8);
                  }),
                ),
              ],
            ),
          ),
        ],
      ),

    );
  }

}

class Section extends StatelessWidget {
  final String title;
  final List<Widget> items;

  Section({required this.title, required this.items});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            title,
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
          GridView.count(
            padding: EdgeInsets.zero, // 去掉内边距
            crossAxisCount: 4,
            shrinkWrap: true,
            physics: NeverScrollableScrollPhysics(),
            children: items,
          ),
        ],
      ),
    );
  }
}

class GridItem extends StatelessWidget {
  final int index;

  GridItem({required this.index});

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Stack(
          children: [
            Container(
              width: 50,
              height: 50,
              decoration: BoxDecoration(
                color: Colors.grey[300],
                borderRadius: BorderRadius.circular(10),
              ),
            ),
            if (index == 1)
              Positioned(
                right: 0,
                child: Container(
                  padding: EdgeInsets.all(2),
                  decoration: BoxDecoration(
                    color: Colors.red,
                    shape: BoxShape.circle,
                  ),
                  child: Text(
                    '1',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: 12,
                    ),
                  ),
                ),
              ),
          ],
        ),
        SizedBox(height: 5),
        Text(
           '通讯录',
          style: TextStyle(fontSize: 12),
        ),
      ],
    );
  }
}
